<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport"
	content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>秀色运动网-XSports.wang</title>
<script src="/js/jquery_2.0.3.js"></script>
<script src="/semantic/semantic.js"></script>
<link rel="stylesheet" type="text/css" href="/semantic/semantic.css">
<style>
[data-selector="sizing"] {
	box-sizing: border-box;
	overflow: hidden;
}

[data-selector="sizing"] {
	margin: 0 !important;
	overflow: hidden;
}

.ui.search .prompt {
    border-radius: 0.5rem;
}

.ui.card {
	width: 100%;
}
</style>
</head>
<body>
	<div class="ui secondary menu grey inverted">
		<a class="item" href="index.html"> <img
			src="http://www.semantic-ui.cn/images/logo.png">
		</a>
		<div class="right menu">
			<div class="item ui search searchclub">
				<div class="ui icon input">
					<input class="prompt" type="text" placeholder="查找俱乐部"> <i
						class="search link icon"></i>
				</div>
				<div class="results"></div>
			</div>
			<a class="item left-menu-btn"><i class="sidebar icon"></i>菜单</a>
		</div>
	</div>

	<div class="ui attached pushable leftmenu">
		<div class="pusher">
			<div class="ui container">
				<h3 class="ui dividing header">最新加入的俱乐部</h3>
				<div class="ui two column grid">
					<div class="column">
						<div class="ui card">
							<a class="image" href="club.html"> <img
								src="http://www.semantic-ui.cn/images/avatar2/large/kristy.png">
							</a>
							<div class="content">
								<a class="header" href="club.html">周末骑行群</a>
								<div class="description">每周都去骑一次，快乐从骑行开始。</div>
							</div>
							<div class="extra content">
								<a><i class="user icon"></i> 22 成员 </a>
							</div>
						</div>
					</div>
					<div class="column">
						<div class="ui card">
							<a class="image" href="club.html"> <img
								src="http://www.semantic-ui.cn/images/avatar/large/jenny.jpg">
							</a>
							<div class="content">
								<a class="header" href="club.html">胸肌小分队</a>
								<div class="description">健身房，走起！小伙，姑娘，加进来。</div>
							</div>
							<div class="extra content">
								<a><i class="user icon"></i> 12 成员 </a>
							</div>
						</div>
					</div>
					<div class="column">
						<div class="ui card">
							<a class="image" href="club.html"> <img
								src="http://www.semantic-ui.cn/images/avatar2/large/molly.png">
							</a>
							<div class="content">
								<a class="header" href="club.html">乒乓球爱好者</a>
								<div class="description">为国球而自豪，从我做起，欢迎加入。</div>
							</div>
							<div class="extra content">
								<a><i class="user icon"></i> 232 成员 </a>
							</div>
						</div>
					</div>
					<div class="column">
						<div class="ui card">
							<a class="image" href="club.html"> <img
								src="http://www.semantic-ui.cn/images/avatar/large/elliot.jpg">
							</a>
							<div class="content">
								<a class="header" href="club.html">一二三四五六七八</a>
								<div class="description">一二三四五六七八九十一二三四五六七八九十</div>
							</div>
							<div class="extra content">
								<a><i class="user icon"></i> 12 成员 </a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="ui labeled icon right inline vertical sidebar menu">
			<a class="item" href="index.html"><i class="home icon"></i>首页</a> <a
				class="item" href="reg.html"><i class="block layout icon"></i>注册</a>
		</div>
	</div>
	<script>
	var content = [
	               { title: 'Andorra' },
	               { title: 'United Arab Emirates' },
	               { title: 'Afghanistan' },
	               { title: 'Antigua' },
	               { title: 'Anguilla' },
	               { title: 'Albania' },
	               { title: 'Armenia' },
	               { title: 'Netherlands Antilles' },
	               { title: 'Angola' },
	               { title: 'Argentina' },
	               { title: 'American Samoa' },
	               { title: 'Austria' },
	               { title: 'Australia' },
	               { title: 'Aruba' },
	               { title: 'Aland Islands' },
	               { title: 'Azerbaijan' },
	               { title: 'Bosnia' },
	               { title: 'Barbados' },
	               { title: 'Bangladesh' },
	               { title: 'Belgium' },
	               { title: 'Burkina Faso' },
	               { title: 'Bulgaria' },
	               { title: 'Bahrain' },
	               { title: 'Burundi' }
	               // etc
	             ];
		$('.searchclub').search({
			source : content,
			searchFields : [ 'title' ],
			searchFullText : false
		});

		$('.ui.sidebar').sidebar({
			context : $('.leftmenu')
		}).sidebar('attach events', '.left-menu-btn');
	</script>

</body>
</html>
